'use client'
import React from 'react'
import FriendSites from './components/FriendSites'
import BattleList from './components/BattleList'
import UploadArea from './components/UploadArea'
import HistoryAndGuide from './guide'

// 新增刷新列表的状态
import { useState } from 'react'

export default function SunHome() {
  // 刷新 key，每次上传成功后递增，触发 BattleList 重新渲染
  const [refreshKey, setRefreshKey] = useState(0)

  // 上传成功后回调
  const handleUploadSuccess = () => {
    setRefreshKey((k) => k + 1)
  }

  return (
    <div className="h-full gap-8 bg-white p-4 pb-8 font-sans sm:p-8">
      <main className="mx-auto flex w-full max-w-2xl flex-col items-center gap-4">
        <UploadArea onSuccess={handleUploadSuccess} />
        {/* 新增一行，历史记录和使用教程 */}
        <HistoryAndGuide />
        <BattleList key={refreshKey} />
      </main>
      <footer className="fixed bottom-0 left-0 z-10 flex w-full flex-wrap items-center justify-center gap-4 border-t border-gray-200 bg-white pt-4">
        <FriendSites />
      </footer>
    </div>
  )
}
